<template>
  <div class="detail-body">
    <h2>{{ title }}</h2>
    <slot class="slot"> 
        <h3>默认内容</h3>
    </slot>
    <div class="more" v-if="more !== ''"> {{ more }} &gt;</div>
  </div>
</template>

<script setup>
defineProps({
    title: {
        type:String,
        default:"默认内容"
    },
    more: {
        type:String,
        default:"默认内容"
    }
})
</script>

<style lang="less" scoped>
    .detail-body {
        box-sizing: border-box;
        border-top: 6px solid #f2f3f4;
        padding: 10px 5px;
        h2 {
            padding: 10px;
            border-bottom: 1px solid #c3c3c3;
        }

        .slot {
            padding: 10px 0;
        }
        .more {
            border-top: 1px solid #c3c3c3;
            font-size: 15px;
            display: flex;
            justify-content: end;
            color: var(--primary-color);
            padding: 10px 0 ;
        }
    }
</style>